<template>
  <div class="section">
    <el-menu :default-active="activeIndex" class="menu" mode="horizontal" @select="handleSelect">
      <el-menu-item index="1">项目管理</el-menu-item>
      <div class="flex-grow" />
      <el-menu-item index="2">班组</el-menu-item>
      <el-menu-item index="3">工程</el-menu-item>
      <el-menu-item index="4">分包</el-menu-item>
    </el-menu>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const activeIndex = ref('1')

const handleSelect = () => {}
</script>

<style lang="scss" scoped>
.section {
  @apply flex justify-end items-center w-full;
  .menu {
    @apply w-full;
    .flex-grow {
      @apply flex-1;
    }
  }
}
</style>
